<template>
	<view class="main-container">
		<uni-list v-if="cardDatas.datas.length">
			<uni-list-item :title="handleNote(cardDatas.datas[0])" :showArrow="false"></uni-list-item>
		</uni-list>
		<view class="form-main">
			<myFrom :form="form" ref="myFromRef" :formList="formList"></myFrom>
		</view>
		<u-button v-if="hasPermission" class="add-button" type="primary" @click="save()" :loading="tableDatas.loading">
			{{ type==='add' ? '提 交':'保 存' }}
		</u-button>
	</view>
</template>

<script>
	import myFrom from '@/components/myForm/index.vue'
	export default {
		components: {
			myFrom
		},
		data() {
			const date = this.$u.timeFormat(new Date, 'yyyy-mm-dd')
			return {
				tableDatas: {
					dicID: 6748,
					datas: [],
					columns: [],
					formData: {},
					loading: false,
					count: 0
				},
				cardDatas: {
					dicID: 5633,
					datas: [],
					columns: [],
					formData: {},
					loading: false,
				},
				form: {
					PreparePlanName: '',
					ProcessDemand: '',
					ReportDate1: date,
					ReportDate2: '',
					PreparePlanTime: '',
					Names: '',
					ReportDate3: '',
					ReportDate4: '',
					Remark1: '',
					ProcessName: '',
					ProcessPriority: ''
				},
				// formList: [],
				hasPermission: false, // 是否有权限
				isEdit: false,
				parentRow: null,
				selectRow: null,
				type: 'add', //新增模式或编辑模式
			}
		},
		computed: {
			formList() {
				return this.tableDatas.columns.filter(val => ['PreparePlanName', 'ReportDate1', 'ReportDate2',
					'PreparePlanTime', 'Remark1', 'Names', 'ProcessName', 'ProcessPriority'
				].includes(val.prop))
			}
		},
		onLoad(e) {
			const resulut = this.$store.getters.userInfo.RoleMap?.some(val => val.RoleID === 'E01Admin' || val.RoleID ===
				'R2309260006') // 管理员和车间主管角色
			this.$set(this, 'hasPermission', resulut)
			this.type = e.type || 'add'
			if (e.row) {
				this.parentRow = JSON.parse(e.row)
				if (this.type === 'edit') {
					this.selectRow = JSON.parse(e.selectRow)
					Object.keys(this.form).forEach(key => {
						if (key === 'Names') this.form[key] = this.selectRow[key] ? this.selectRow[key].split(
								',') :
							null
						else this.form[key] = this.selectRow[key] || null
					})
				}
			}
			this.getConfigData()
			this.getCardData()
		},
		methods: {
			// 获取数据
			async getCardData(remark = 0) {
				const condition = {
					dicID: this.cardDatas.dicID,
				}
				condition.OrderNo = this.parentRow.OrderNo
				condition.MaterialName = this.parentRow.MaterialName
				this.cardDatas.loading = true
				const res = await this.$request.post({
					url: '/APSAPI/APSData',
					data: condition
				}).catch(err => err)
				this.cardDatas.loading = false
				if (!res) return
				const {
					result,
					msg,
					data,
					Columns
				} = res
				// 读取组件分配任务数，作为新增的顺序参考
				if (this.type === 'add') {
					this.form.ProcessPriority = data[0]?.ReportCount ? data[0]?.ReportCount + 1 : 1
				}
				if (data.length) this.tableDatas.count = data[0].ReportCount || 0
				this.$set(this.cardDatas, 'datas', data)
				this.$set(this.cardDatas, 'columns', Columns[0])
			},
			// 查询配置
			async getConfigData(remark = 0) {
				const condition = [{
					ID: 6748
				}]
				this.tableDatas.loading = true
				const res = await this.$request.post({
					url: '/APSAPI/GetConfig',
					data: condition
				}).catch(err => err)
				this.tableDatas.loading = false
				if (!res) return
				const {
					datas
				} = res
				this.$set(this.tableDatas, 'columns', datas[0])
			},
			// 选择确认
			confirm(e, col, type) {
				const prop = col.prop
				let selectData
				if (type === 'date') {
					selectData = e.year + '-' + e.month + '-' + e.day
				}
				if (type === 'select') {
					selectData = e[0].value
					// 显示label
					this.$set(this.form, prop + 'label', e[0].label)
				}
				this.$set(this.form, prop, selectData)
			},
			// 打开选择
			openPicker(col) {
				this.$set(col, 'show', true)
			},
			// 提示字符串处理
			handleNote(row) {
				return `PO单号：${row.SourceOrderNo||''}
				产品名称：${row.ProductName||''}
				组件名称：${row.MaterialName||''}
				派工任务：${row.ReportCount||0}
				已完成数：${row.ReportFishCount||0}
				配置要求：${row.Disposition||'无'}
				其他要求：${row.OtherRequirements||'无'}`
			},
			// 提交保存
			async save() {
				const type = this.type
				const submitData = JSON.parse(JSON.stringify(this.form))
				submitData.dicID = this.tableDatas.dicID
				if (type === 'add') {
					Object.assign(submitData, this.parentRow)
					submitData.Status = 1
					submitData.ProductionStatus = 86
					submitData.RowNumber = 1
				} else {
					submitData.OrderBOMInstallID = this.parentRow.OrderBOMInstallID
				}
				const requiredColumns = this.tableDatas.columns.filter(val => val.Required)
				let requireStatus = false
				requiredColumns.forEach(val => {
					if (Object.keys(this.form).includes(val.prop) && !this.form[val.prop]) {
						requireStatus = true
					}
				})
				if (requireStatus) return uni.showToast({
					icon: 'error',
					title: '请填写必填项'
				})
				// 处理多选项
				submitData.Names = submitData.Names.join()
				if (this.type === 'edit') {
					submitData.ReportID = this.selectRow.ReportID
				}
				this.tableDatas.loading = true
				const res = await this.$request.post({
					url: '/APSAPI/SaveData',
					data: [submitData]
				}).catch(err => err)
				this.tableDatas.loading = false
				if (!res) return
				const {
					msg
				} = res
				uni.showToast({
					title: msg,
					icon: 'success'
				})
				this.$u.route({
					type: 'back',
					url: '/pages/Isgo/OrderScheduling/OrderScheduling3',
					params: this.parentRow
				})
			},
		}

	}
</script>

<style scoped lang="scss">
	.main-container {
		width: 100%;
		height: 100%;
		overflow: auto;

		.form-main {
			width: 100%;
			padding: 20rpx 20rpx 80rpx;
		}

		.add-button {
			position: fixed;
			bottom: 0;
			width: 100%;
			left: 50%;
			transform: translateX(-50%);
		}
	}

	.uni-list-item {
		background-image: linear-gradient(to right top, #18f4f4, #35ecf7, #4de4f8, #61dcf6, #73d4f1, #6dd4f0, #67d4ee, #61d4ed, #3cdceb, #00e4e3, #00ead5, #12f0c1);
	}

	::v-deep .uni-list-item__content {
		padding: 5rpx 10rpx;
	}

	::v-deep .uni-list-item__content-title {
		font-size: small;
	}
</style>